<template>
  <div v-if="loading" class="comp-loading-mask">
    <a-spin class="spinner" ></a-spin>
  </div>
</template>
<script lang="ts">
import { Component, Vue, Prop } from 'vue-property-decorator'

@Component
export default class LoadingMask extends Vue{
  @Prop({ type: Boolean })
  loading:boolean = false
}
</script>
<style lang="less" scoped>
.comp-loading-mask {
  background: rgba(87, 96, 230, 0.05);
  height: 100%;
  position: absolute;
  width: 100%;
  z-index: 9999;
  
  .spinner {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
  }
}
</style>